<template>
	<view>
		<scroll-view scroll-y class="page">
			<!-- 头部 -->
			<cu-custom bgColor="bg-rgb" :isBack="true">
				<block slot="backText">返回</block>
				<block slot="content">线程扫描</block>
			</cu-custom>
			<!-- 查询条件 -->
			<view class="fixed" :style="[{animationDelay: 0.1 + 's'}]">
				<form>
					<view class="cu-form-group">
						<image class="icon" src="../../static/saomiao.png" mode=""></image>
						<input auto-focus placeholder="请扫描或输入制令单" name="input" v-model="myFormData.commandCode"
							@confirm="addScanContent"></input>
					</view>
					<view class="cu-form-group">
						<image class="icon" src="../../static/saomiao.png" mode=""></image>
						<input placeholder="请扫描或输入PCB板" name="input" v-model="myFormData.scanContent"
							@confirm="addScanContent"></input>
					</view>
					<view class="cu-form-group">
						<picker :value="index2" @change="bindPickerChange2" :range="array">
							<label>正反面：</label>
							<label>{{array[index2]}}</label>
						</picker>
						<!-- <image class="icon" src="../../static/saomiao.png" mode=""></image>
						<input placeholder="请扫描" name="input" v-model="myFormData.scanContent" @confirm="addScanContent"></input> -->
					</view>
				</form>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				myFormData: {
					commandCode: '',
					scanContent: '',
					batchNum: '1',
					query3:'正面'
				},
				array: ['正面', '反面'],
				index2: 0,

			}
		},
		methods: {
			bindPickerChange2: function(e) {
				this.index2 = e.target.value
				this.myFormData.query3 = this.array[this.index2]
				this.addScanContent()
			},
			addScanContent() {
				let data = {...this.myFormData}
				this.$http.post('produce/mesCourseScan/add', data).then(res => {
					uni.hideLoading()
					this.myFormData.scanContent = ''
					if (res.data.success) {
						// this.$tip.success(res.data.message);
						this.modal.show({
							type: 'success',
							content: res.data.message
						})
					} else {
						// this.$tip.error(res.data.message)
						this.modal.show({
							type: 'error',
							content: res.data.message
						})
					}
				})
			}
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f1f1f1;

		.fixed {
			position: fixed;
			z-index: 1;
			width: 100%;
			background-color: white;
			height: 100rpx;
			border-bottom: 1rpx solid #eee;

			.last {
				border-bottom: 1rpx solid #eee;
				position: relative;

				.icon {
					width: 30rpx;
					height: 29rpx;
					position: absolute;
					top: 36rpx;
					left: 60rpx;
				}

				input {
					width: 686rpx;
					height: 68rpx;
					background: #FFFFFF;
					border: 1px solid #D5D8DF;
					border-radius: 34px;
					padding-left: 79rpx;
				}
			}

			.cu-form-group {
				position: relative;

				.icon {
					width: 30rpx;
					height: 29rpx;
					position: absolute;
					top: 36rpx;
					left: 60rpx;
				}

				input {
					width: 686rpx;
					height: 68rpx;
					background: #FFFFFF;
					border: 1px solid #D5D8DF;
					border-radius: 34px;
					padding-left: 79rpx;
				}
			}
		}
		.cu-form-group picker::after{
			 top: -13px !important;
		}
	}
</style>
